<template>
	<view>
		<!-- 秒杀商品详情 -->
		<image src="../../../../static/images/秒杀活动-列表.png" class="topImage"></image>
		<view class="textPrice">

			<view class="miao">
				秒杀专场
			</view>
			<view class="price">
				<text style="font-weight: 600;">￥234.50</text>
				<text class="decoration">￥345.00</text>
			</view>
			<view class="time">
				销量301
			</view>
			<view style="line-height: 9vh;">
				<uni-countdown color="#FFFFFF" background-color="red" border-color="red" :day="1" :hour="2" :minute="30"
					:second="0"></uni-countdown>
			</view>
		</view>
		<view style="font-weight: 600;margin-left: 3%;margin-top: 20rpx;">
			颈部理疗仪
		</view>
		<view style="font-size: 20rpx;width: 95%;margin-left: 3%;margin-top: 20rpx;">
			颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简颈部理疗仪简介简介介简介
		</view>
		<view style="display: flex;" @click="evaluate">
			<image src="../../../../static/images/head.png"
				style="margin-left: 3%;margin-top: 20rpx; width: 50rpx;height: 60rpx;"></image>
			<text style="margin-top: 20rpx;margin-left: 2%;">
				g**8
			</text>
		</view>
		<view style="margin-left: 3%;width: 95%;font-size: 25rpx;" @click="evaluate">
			保湿效果:非常水润吸收效果:吸收ok肤质改善情况:皮肤水嫩很多整体评价:便宜大碗推荐我的肤质:干皮
		</view>
		<view
			style="width: 95%;height: 5vh;border: #000000 solid 1px;display: flex;margin-top: 20rpx; margin-left: 3%;line-height: 5vh;text-align: center;">
			<view style="width: 33%;">
				评价
			</view>
			<view style="width: 33%; color: #02C4C7;">
				商品
			</view>
			<view style="width: 33%;">
				售后
			</view>
		</view>
		<view style="margin-top: 20rpx;width: 95%;margin-left: 5%;">
			<image src="../../../../static/images/商品详情-html.png" style="width: 100%;height: 90vh;"></image>
		</view>
		<view class="position">
			<image src="../../../../static/images/购物车空.png" style="width: 40rpx;height: 40rpx;margin-top: 10rpx;">
			</image>
			<view style="color: #fff;font-size: 25rpx;">
				购物车
			</view>
		</view>
		<view style="font-weight: 600;margin-left: 3%;margin-top: 20rpx;">
			颈部理疗仪
		</view>
		<view style="font-size: 20rpx;width: 95%;margin-left: 3%;margin-top: 20rpx;">
			颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部理疗仪简介简介颈部仪简介简介颈部理疗仪简颈部理疗仪简介简介介简介
		</view>
		<view style="width: 100%;height: 10vh;"></view>
		<view style="position: fixed;bottom: 0;border-radius: 10rpx; width: 95%;height: auto;display: flex;line-height: 10vh;margin-top: 50rpx;margin-left: 3%;">
			<view class="left" @click="tocart()">
				加入购物车
			</view>
			<view class="right" @click="button">
				立即够买
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		onLoad(option) {
			console.log('跳转id' + option.id)
		},
		methods: {
			// 选着提货方式
			button(){
				uni.navigateTo({
				    url: '/pages/home/SecKill-active/Product-details/settlement/settlement'
				});
			},
			// 宝贝评价
			evaluate(){
				uni.navigateTo({
				    url: '/pages/home/SecKill-active/Product-details/evaluate/evaluate'
				});
			},
			// 跳转购物车
			tocart(){
				uni.switchTab({
					url:'../../../Shopping/Shopping'
				})
			}
		}
	}
</script>

<style scoped>
	.right{
		width: 50%;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		color: #fff;
		background-color: red;
		border-radius: 0 10rpx 10rpx 0;
	}
	.left{
		width: 50%;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		color: #fff;
		background-color: #4CD964;
		border-radius: 10rpx 0 0 10rpx;
	}
	.position {
		width: 100rpx;
		height: 100rpx;
		position: fixed;
		left: 315px;
		top: 85vh;
		text-align: center;
		background-color: #007AFF;
		border-radius: 50%;
	}

	.time {

		font-size: 30rpx;
		width: 150rpx;
		line-height: 10vh;
		color: #fff;
	}

	.decoration {
		font-size: 23rpx;
		text-decoration: line-through;
		color: #fff;
	}

	.price {
		width: 38%;
		height: 10vh;
		line-height: 10vh;
		margin-left: 120rpx;
		color: #fff;
	}

	.miao {
		width: 80rpx;
		height: 80rpx;
		background-color: #fff;
		margin-top: 20rpx;
		margin-left: 20rpx;
		text-align: center;
		border-radius: 5rpx;
		position: absolute;
	}

	.textPrice {
		width: 100%;
		height: 10vh;
		background-color: #007AFF;
		display: flex;
	}

	.topImage {
		width: 95%;
		margin-left: 3%;
		height: 45vh;
	}
</style>
